import React from 'react'
import AppItem, { AppItemData } from './app-item'

interface AppGridProps {
  items: AppItemData[]
}

const AppGrid: React.FC<AppGridProps> = React.memo((props) => {
  return (
    <div
      className='grid grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-x-3 gap-y-3 overflow-y-auto'
      style={{ maxHeight: 'calc(100vh - 7.25rem)' }}
    >
      {props.items.map((appItem, index) => (
        <AppItem key={index} appItem={appItem} />
      ))}
    </div>
  )
})

export default AppGrid
